<template>
    <!-- 轮播图 -->
    <mt-swipe :auto="4000">
        <mt-swipe-item v-for='(item,i) in lunbotu' :key="i">
            <img :src="item[imgname]" :class="[isfull?'img-full':'img-normal']">
        </mt-swipe-item>
    </mt-swipe>
</template>

<script>

export default {
    data(){
        return{}

    },
    methods: {
        
    },
    props:["lunbotu","imgname","isfull"]//将来谁使用这个轮播图组件，就必须向这个组件传递一个轮播图数组，
                    //同时只能接收img属性的图片作为轮播图展示出来
    

}
</script>

<style lang="scss" scoped>
.mint-swipe{
    height: 180px;
}
.mint-swipe-item{
    // 在父元素中，直接让子元素居中显示
    text-align: center;
    .img-full{
        // 如果给图片应用这个类，图片的宽和高都撑满父元素的
        width:100%;
        height: 100%;
        overflow: hidden;
    }
     .img-normal{
        //  如果给图片应用这个类，则图片高度是100%，宽度是自适应，横向的位置是居中显示
        height: 100%;
    }

}
</style>